import 'package:cbec_app/components/base/base_function.dart';
import 'package:cbec_app/components/base/base_icon.dart';
import 'package:cbec_app/components/base/base_interactive.dart';
import 'package:cbec_app/components/common/common_style.dart';
import 'package:cbec_app/components/popup/filtter_popup.dart';
import 'package:cbec_app/utils/Tools.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get_rx/src/rx_typedefs/rx_typedefs.dart';

//排序筛选组件
class SortFlitterBox extends StatefulWidget {
  ///回调函数
  final Function(int index)? callback;

  final Function(bool isGrid)? showCallBack;

  ///是否显示筛选
  final bool? showFlitter;

  ///激活索引
  final int? curIndex;

  ///筛选列表
  final List<Map<String, dynamic>> sortList;

  const SortFlitterBox({super.key, this.curIndex = 0, this.callback, required this.sortList, this.showFlitter = true, this.showCallBack});

  @override
  State<SortFlitterBox> createState() => _SortFlitterBoxState();
}

class _SortFlitterBoxState extends State<SortFlitterBox> {
  int selected = 0;

  //  grid/ 横向排布item，
  bool isGrid = true;

  @override
  void initState() {
    super.initState();
    if (widget.curIndex != null) {
      selected = widget.curIndex!;
    }
  }

  @override
  Widget build(BuildContext context) {
    return Container(
        height: 36.h,
        padding: EdgeInsets.fromLTRB(8.w, 10.w, 8.w, 10.w),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Container(
              width: widget.showFlitter == true ? 300.w : 350.w,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: List.generate(widget.sortList.length, (index) {
                  return buildGridItem(index);
                }),
              ),
            ),
            widget.showFlitter == true
                ? BaseInteractive(
                    onClick: () {
                      setState(() {
                        isGrid = !isGrid;
                        if (widget.showCallBack != null) {
                          widget.showCallBack!(isGrid);
                        }
                      });
                    },
                    childWidget: Row(
                      children: [
                        BaseIcon(
                          url: isGrid ? 'ic_colum.png' : 'ic_row.png',
                          color: Tools.fromHex('#515151'),
                        ),
                      ],
                    ),
                  )
                : const SizedBox()
          ],
        ));
  }

  BaseInteractive buildGridItem(int index) {
    return BaseInteractive(
      onClick: () {
        chiose(index);
      },
      childWidget: Container(
        child: Row(
          children: [
            Text(widget.sortList[index]['title'], style: setTextStyle(13, FontWeight.w300, selected == index ? Tools.fromHex("#F83F2D") : Tools.fromHex("#999999"))),
            widget.sortList[index]['sort'] != ''
                ? Icon(
                    widget.sortList[index]['sort'] == 'asc' ? Icons.arrow_upward : Icons.arrow_downward,
                    size: 12,
                    color: selected == index ? Tools.fromHex("#F83F2D") : Tools.fromHex("#999999"),
                  )
                : const SizedBox(),
          ],
        ),
      ),
    );
  }

  void chiose(index) {
    setState(() {
      selected = index;
      if (widget.callback != null) {
        widget.callback!(index);
      }
    });
  }
}
